<template>
    <div class="vioce-page">
      <div class="head">
        <span class="head-out"></span>
        <span class="head-title">xxxx3</span>
        <span class="head-out">
          <span>实时数据</span>
          <el-icon class="head-icon" @click="handleGoBack()"
            ><switch-button
          /></el-icon>
        </span>
      </div>
      <div class="main">
        <div class="left">
       
        </div>
        <div class="middle">
    
        </div>
 
      </div>
    </div>
  </template>
  
  <script setup>
  import { constantRoutes } from "@/router";
 
  
  const router = useRouter();
  
  const data = reactive({
    leftChartData1: {
      title: ["222"],
      expectedData: [120, 200, 150, 80, 70, 110, 130],
      actualData: [120, 200, 150, 80, 70, 110, 130],
    },
    leftChartData2: {
      title: ["222"],
      expectedData: [120, 200, 150, 80, 70, 110, 130, 80, 70],
    },
    rightChartData2: {
      title: ["222"],
      expectedData: [120, 200, 150, 80, 70, 110, 130, 80, 70],
    },
  });
  
  /** 返回上一页面 */
  function handleGoBack() {
    // router.go(-1);
    router.push('/sub')
  }
  
  const { leftChartData1, leftChartData2, rightChartData2 } = toRefs(data);
  </script>
  
  <style lang="scss" scoped>
  .vioce-page {
    width: 1920px;
    height: 1080px;
    background-color: #003669;
    .head {
      width: 100%;
      height: 60px;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      .head-title {
        font-size: 30px;
        color: #fff;
      }
      .head-out {
        width: 200px;
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        padding-right: 20px;
      }
      .head-icon {
        color: #fff;
        font-size: 22px;
        cursor: pointer;
      }
    }
    .main {
      display: flex;
      flex-direction: row;
      padding-left: 20px;
      padding-right: 20px;
     
    
     
    }
    /* 公共样式 */
  }
  </style>
  